<template>
  <div class="base-count">
    <!-- <button @click="count--">-</button>
    <span>{{ count }}</span>
    <button @click="count++">+</button> -->
    <button @click="sub(10, $event)">-10</button>
    <span>{{ count }}</span>
    <button @click="add(10, $event)">+10</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      count: 0,
    };
  },
  methods: {
    sub(num, e) {
      console.log(e);
      this.count -= num;
    },
    add(num, e) {
      console.log(e);
      this.count += num;
    },
  },
};
</script>

<style lang="less">
.base-count {
  span {
    padding: 0 10px;
  }
}
</style>
